<!DOCTYPE HTML>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

        <title>无标题文档</title>

        <script>

            window.onload = function(){

				var oUl = document.getElementById("list");

				var aLi = oUl.getElementsByTagName("li");

				var strongs = oUl.getElementsByTagName("strong");

				var ems = oUl.getElementsByTagName("em");

				var spans = oUl.getElementsByTagName("span");

				//alert(spans.length)

				var P = document.getElementsByTagName("p")[0];

				

				for (var i = 0; i < aLi.length; i++) {

					//aLi[i].getElementsByTagName(‘strong‘)[0].index = i;//

					//aLi[i].getElementsByTagName(‘em‘)[0].index = i;

					//aLi[i].getElementsByTagName(‘span‘)[0].index = i;

						fnCount(aLi[i]);

				}

			

				var M = [];

				var pri = [];

				var num1 = 0, num2 = 0, num3 = 0;		

			function fn(){

				var num1 = 0, num2 = 0, num3 = 0;

			for (var j = 0; j < aLi.length; j++) {

								

		num1+=parseFloat(strongs[j].innerHTML);

		num2+=parseFloat(spans[j].innerHTML);

	var d=parseInt(strongs[j].innerHTML);

							//alert(d);

			if(d>0){ M.push(parseFloat(ems[j].innerHTML));}

										}; //alert(M);

				M.sort(function(a,b){return a-b;});

					//alert(M[M.length-1]);

	P.innerHTML="商品合计共:" + num1 + "件,共花费了:" + num2 + "元" + "<br/>"

		+"其中最贵的商品单价是:" + M[M.length-1] + "元";

									};			

				

      function fnCount(li){

					var aBtn = li.getElementsByTagName("input");
					// var aBt = li.getElementsByTagName("add");


					var oStrong = li.getElementsByTagName("strong")[0];

					var oEm = li.getElementsByTagName("em")[0];

					var oSpan = li.getElementsByTagName("span")[0];

					var n = oStrong.innerHTML; // ‘0‘

					var price = parseFloat(oEm.innerHTML); // 12.5

										

					aBtn[0].onclick = function(){

						if (n > 0) {

							n--;

						}

						oStrong.innerHTML = n;

						oSpan.innerHTML = n * price + "元";

							fn();

				};

					aBtn[1].onclick = function(){
                        if(n<10){
						n++;
                         }
						oStrong.innerHTML = n;

						oSpan.innerHTML = n * price + "元";

							fn();

					}

				};

  };

 </script>

    </head>

    <body>

        <ul id="list">

            <li>

                <input type="button" value="-" /><strong>0</strong>

                <input type="button" value="+"/>单价：<em>12.5元</em>

                小计：<span>0元</span>

            </li>

            <li>

                <input type="button" value="-"/><strong>0</strong>

                <input type="button" value="+"/>单价：<em>10.5元</em>

                小计：<span>0元</span>

            </li>

            <li>

                <input type="button" value="-"/><strong>0</strong>

                <input type="button" value="+"/>单价：<em>18.5元</em>

                小计：<span>0元</span>

            </li>

            <li>

                <input type="button" value="-"/><strong>0</strong>

                <input type="button" value="+"/>单价：<em>8元</em>

                小计：<span>0元</span>

            </li>

            <li>

                <input type="button" value="-"/><strong>0</strong>

                <input type="button" value="+"/>单价：<em>14.5元</em>

                小计：<span>0元</span>

            </li>

        </ul>

        <p>

            商品合计共：0件，共花费了：0元

            <br/>

            其中最贵的商品单价是：0元

        </p>

    </body>

</html>